import TauTable from '@/components/TauTable';
import { useStore } from '@/hooks';
import { t } from '@lingui/macro';
import { uniqueId } from 'lodash';
import { observer } from 'mobx-react-lite';
import React from 'react';
import { column, orderModel } from '../../stores/definitions';

const tableId = uniqueId('tauTable');

const TicketInfoTable = (props) => {
  const { dataSource } = props;
  const subModel = orderModel.tickets[0];
  const { scTaskStore: store } = useStore();

  return (
    <TauTable
      instanceId={tableId}
      primaryKey="idx"
      size="small"
      hidePagination
      tableLayout="fixed"
      dataSource={dataSource}
      columns={[
        { title: t`序号`, dataIndex: 'idx', width: 44, cell: (v, i) => store._mainArgs.idx(i) },
        column('ticketCode', {
          width: 168,
          cell: (v, i, r) => {
            const { operatingTicketCode = null } = r;
            return (<span>{operatingTicketCode || v}</span>);
          },
        }, subModel),
        column('fromStationName', {}, subModel),
        column('toStationName', {}, subModel),
        column('shiftTime', {}, subModel),
        column('passengerName', {}, subModel),
        column('state', {}, subModel),
        column('writeOffDate', {
          title: '核销时间',
        }, subModel),
      ]}
    />
  );
};

export default observer(TicketInfoTable);
